<template>
	<view class="Activity-Registration">
		<uni-card>
			<view class="">
				<uni-title type="h4" align="center" :title="allData.title"></uni-title>
			</view>
			<view class="flex-r">
				<text>{{allData.createTime}}</text>
			</view>
			<view class="textbox">
				<text>{{allData.detailed}}</text>
			</view>
			<view class="imgbox">
				<image
					:src="allData.photo"
					mode=""></image>
			</view>
			<view class="flex-center">
				<text>活动主题：</text>
			</view>
			<uni-title type="h4" align="center" :title="allData.theme"></uni-title>
			<view class="flex-center">
				<text>报名费用：</text><text class="red">{{allData.registration}}元</text><text>/组</text>
			</view>
			<view class="flex-center">
				<text>活动时间：</text>
			</view>
			<view class="flex-center">
				<text>{{allData.timeRange}}</text>
			</view>
			<view class="flex-center">
				<text>活动地点：</text>
			</view>
			<view class="flex-center">
				<text>{{allData.address}}</text>
			</view>
			<view class="ibox">
				<img src="https://cimg.axureshop.com/47/f6/19/47f6193bc5004b1388c6fa23d2a9bd4e/images/%E6%B4%BB%E5%8A%A8%E8%AF%A6%E6%83%85-%E5%B7%B2%E7%BB%93%E6%9D%9F/u2066.svg" alt="">
			</view>
			<view class="bbox">
				<text>活动已结束，下次早点来哦~</text>
			</view>
		</uni-card>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from "@dcloudio/uni-app";
	import http from "@/utils/http.js"
	
	import {
		ref,
		onMounted
	} from "vue"
	const allData=ref({})
	
	onLoad((option) => {
		http({
			url: '/preSignUp/' + option.id,
			method: "post"
		}).then((res) => {
			console.log(res.data);
			if(res.code===0){
				allData.value=res.data
			}
		})
	})
</script>

<style lang="less">
	.Activity-Registration{
		padding-bottom:40rpx ;
	}
	.red{
		color: red;
		font-size: 28rpx;
		font-weight: 700;
	}
	.textbox{
		// width: 630rpx;
		font-size: 24rpx;
		color: #999;
		text-indent: 2em;
	
	}
	.imgbox{
		image{
			width: 100%;
			height: 370rpx;
		}
	}
	.flex-r{
		display: flex;
		justify-content: flex-end;
		align-items: center;
		font-size: 24rpx;
		color: #999;
	}
	.flex-center{
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24rpx;
		color: #999;
	}
	.ibox{
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 40rpx 0;
		image{
			width: 400rpx;
			height: 300rpx;
		}
	}
	.bbox{
		color: #999;
		font-weight: 700;
		font-size: 28rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: 40rpx 0;
	}
</style>
